<div>

    <div class="ibox ">
        <div class="ibox-title">
            <h5>
                <vc:i18n name="查询条件" namespace="accountBondObjDetail"></vc:i18n>
            </h5>
            <div class="ibox-tools" style="top:10px;">

            </div>
        </div>
        <div class="ibox-content">
            <div class="row">
                <div class="col-sm-2">
                    <div class="form-group">
                        <select class="custom-select" v-model="accountBondObjDetailInfo.conditions.objId">
                            <option selected disabled value="">{{vc.i18n('请选择商铺','accountBondObjDetail')}}
                            </option>
                            <option :value="item.shopId" v-for="(item,index) in accountBondObjDetailInfo.shops">
                                {{item.shopName}}
                            </option>
                        </select>
                    </div>
                </div>
                <div class="col-sm-2">
                    <div class="form-group">
                        <select class="custom-select" v-model="accountBondObjDetailInfo.conditions.state">
                            <option selected disabled value="">{{vc.i18n('请选择状态','accountBondObjDetail')}}
                            </option>
                            <option :value="3308">{{vc.i18n('交保证金','accountBondObjDetail')}}</option>
                            <option :value="3309">{{vc.i18n('退保证金','accountBondObjDetail')}}</option>
                        </select>
                    </div>
                </div>
                <div class="col-sm-1">
                    <button type="button" class="btn btn-primary btn-sm"
                        v-on:click="_queryAccountBondObjDetailMethod()">
                        <i class="glyphicon glyphicon-search"></i> <span>
                            <vc:i18n name="查询" namespace="accountBondObjDetail"></vc:i18n>
                        </span>
                    </button>
                </div>
            </div>
        </div>
    </div>

    <div class="ibox">
        <div class="ibox-title">
            <h5>
                <vc:i18n name="保证金明细" namespace="accountBondObjDetail"></vc:i18n>
            </h5>
            <div class="ibox-tools" style="top:10px;">
            </div>
        </div>
        <div class="ibox-content">

            <table class="footable table table-stripped toggle-arrow-tiny" data-page-size="15">
                <thead>
                    <tr>
                        <th class="text-center">
                            <vc:i18n name="保证金ID" namespace="accountBondObjDetail"></vc:i18n>
                        </th>
                        <th class="text-center">
                            <vc:i18n name="保证金对象" namespace="accountBondObjDetail"></vc:i18n>
                        </th>
                        <th class="text-center">
                            <vc:i18n name="应收金额" namespace="accountBondObjDetail"></vc:i18n>
                        </th>
                        <th class="text-center">
                            <vc:i18n name="实收金额" namespace="accountBondObjDetail"></vc:i18n>
                        </th>
                        <th class="text-center">
                            <vc:i18n name="状态" namespace="accountBondObjDetail"></vc:i18n>
                        </th>
                        <th class="text-center">
                            <vc:i18n name="开始时间" namespace="accountBondObjDetail"></vc:i18n>
                        </th>
                        <th class="text-center">
                            <vc:i18n name="结束时间" namespace="accountBondObjDetail"></vc:i18n>
                        </th>
                    </tr>
                </thead>
                <tbody>
                    <tr v-for="accountBondObjDetail in accountBondObjDetailInfo.details">
                        <td class="text-center">{{accountBondObjDetail.bobjId}}</td>
                        <td class="text-center">{{accountBondObjDetail.objName}}</td>
                        <td class="text-center">{{accountBondObjDetail.receivableAmount}}</td>
                        <td class="text-center">{{accountBondObjDetail.receivedAmount}}</td>
                        <td class="text-center">{{accountBondObjDetail.state == 3308?'交保证金':'退保证金'}}</td>
                        <td class="text-center">{{accountBondObjDetail.startTime}}</td>
                        <td class="text-center">{{accountBondObjDetail.endTime}}</td>
                    </tr>
                </tbody>
            </table>
            <!-- 分页 -->
            <vc:create path="frame/pagination"></vc:create>
        </div>
    </div>


</div>